﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>替换节点</title>
</head>
<body>
    <ul id="myList"><li>咖啡</li><li>红茶</li><li>牛奶</li></ul>
    <p id="demo">单击按钮替换列表中的第一项。</p>
    <button onclick="myFunction()">替换节点</button>
    <script>
        function myFunction() {
            var textnode = document.createTextNode("开水");
            var item = document.getElementById("myList").childNodes[0];
            item.replaceChild(textnode, item.childNodes[0]);
        }
    </script>
    <p>首先创建一个文本节点。<br>然后替换第一个列表中的第一个子节点。</p>
</body>
</html>